<template>
    <div class="contractType">
        <div class="card-box">
            <div class="card-title">工程信息</div>
            <el-form ref="engineering" :model="projectForm.projectContract" class="form-wrap" size="small" label-position="top">
                <el-form-item label="工程名称" prop="projectName">
                    <span class="int-text">{{projectForm.projectContract.projectName}}</span>
                </el-form-item>
                <el-form-item label="工程地址" prop="projectAddress">
                    <span class="int-text">{{projectForm.projectContract.projectAddress}}</span>
                </el-form-item>
                <el-form-item label="工程类型" prop="projectType">
                    <span class="int-text">{{getCardTypeValue(projectForm.projectContract.projectType,projectTypes)}}</span>
                </el-form-item>
            </el-form>
        </div>
        <div class="card-box">
            <div class="card-title">合同信息</div>
            <el-form ref="projectContract" :model="projectForm.projectContract" class="form-wrap" size="small" label-position="top">
                <el-form-item label="合同编号" prop="contractNum">
                    <span class="int-text">{{projectForm.projectContract.contractNum}}</span>
                </el-form-item>
                <el-form-item label="合同类型" prop="contractType">
                    <span class="int-text">{{getCardTypeValue(projectForm.projectContract.contractType,contractTypes)}}</span>
                </el-form-item>
                <el-form-item label="合同金额(元)" prop="contractAmount">
                    <span class="int-text">{{projectForm.projectContract.contractAmount}}</span>
                </el-form-item>
                <el-form-item label="单价(元/m²)" prop="unitPrice">
                    <span class="int-text">{{projectForm.projectContract.unitPrice}}</span>
                </el-form-item>
                <el-form-item label="签订日期" prop="contractDate">
                    <span class="int-text">{{projectForm.projectContract.contractDate}}</span>
                </el-form-item>
                <el-form-item label="合同开始日期" prop="startDate">
                    <span class="int-text">{{projectForm.projectContract.startDate}}</span>
                </el-form-item>
                <el-form-item label="合同结束日期" prop="endDate">
                    <span class="int-text">{{projectForm.projectContract.endDate}}</span>
                </el-form-item>
                <el-form-item label="乙方单位名称" prop="partybUnit">
                    <span class="int-text">{{projectForm.projectContract.partybUnit}}</span>
                </el-form-item>
                <el-form-item label="联系人" prop="partybContact">
                    <span class="int-text">{{projectForm.projectContract.partybContact}}</span>
                </el-form-item>
                <el-form-item label="联系电话" prop="partybPhone">
                    <span class="int-text">{{projectForm.projectContract.partybPhone}}</span>
                </el-form-item>
                <el-form-item label="是否有补充协议" prop="supplement">
                    <span class="int-text">{{getCardTypeValue(projectForm.projectContract.supplement,supplements)}}</span>
                </el-form-item>
                <el-form-item label="补充协议签订日期" prop="signDate" v-if="projectForm.projectContract.supplement === '1'">
                    <span class="int-text">{{projectForm.projectContract.signDate}}</span>
                </el-form-item>
                <el-form-item label="补充协议期限" prop="suppleStart" v-if="projectForm.projectContract.supplement === '1'">
                    <span class="int-text">{{projectForm.projectContract.suppleStart}}至{{projectForm.projectContract.suppleEnd}}</span>
                </el-form-item>
                <el-form-item label="补充协议金额(元)" prop="suppleAmount" v-if="projectForm.projectContract.supplement === '1'">
                    <span class="int-text">{{projectForm.projectContract.suppleAmount}}</span>
                </el-form-item>
                <el-form-item label="备注" class="full" prop="remarks">
                    <span class="int-text">{{projectForm.projectContract.remarks}}</span>
                </el-form-item>
            </el-form>
        </div>
        <div class="card-box" v-if="projectForm.projectContract.supplement === '1'">
            <div class="card-title">补充协议</div>
            <div class="handling-opinions">
                <v-upload
                    ref="supplementaryUpload"
                    :busId="projectForm.projectContract.projectContractId"
                    modelType="supplementary"
                    @loadCompleted="supplementaryLoadCompleted"
                    isShowFileList
                    :isView="true"
                    multiple
                    v-model="supplementaryFileList"/>
            </div>
        </div>
        <div class="card-box">
            <div class="card-title">附件</div>
            <div class="handling-opinions">
                <v-upload
                    ref="normalUpload"
                    :busId="projectForm.projectContract.projectContractId"
                    modelType="normal"
                    @loadCompleted="normalLoadCompleted"
                    isShowFileList
                    :isView="true"
                    multiple
                    v-model="fileList"/>
            </div>
        </div>
        <div class="card-box">
            <div class="card-title">子合同信息</div>
            <div class="handling-opinions">
                <el-table :data="projectForm.subContracts" align="center">
                    <el-table-column prop="contractNum" label="合同编号" width="120">
                    </el-table-column>
                    <el-table-column prop="contractType" label="合同类型" width="120">
                        <template slot-scope="scope">
                            <span>{{getCardTypeValue(scope.row.contractType,contractTypes)}}</span>
                        </template>
                    </el-table-column>
                    <el-table-column prop="contractDate" label="签订日期" width="120">
                    </el-table-column>
                    <el-table-column prop="contractAmount" label="合同金额（元）" width="120">
                    </el-table-column>
                    <el-table-column prop="partybUnit" label="乙方单位名称" width="120">
                    </el-table-column>
                    <el-table-column
                        label="操作"
                        width="100">
                        <template slot-scope="scope">
                            <el-button @click="handleClickLook(scope)" type="text" size="small">查看</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
        </div>
        <div class="card-box">
            <div class="handling-commit">
                <el-button type="primary" plain class="btn" @click="handleBack">关闭</el-button>
            </div>
        </div>
        <subShow ref="subShow" @handleClose="handleClose" v-if="showActual" @beforeClose="handleClose"></subShow>
    </div>
</template>

<script src="./show-actual.js">

</script>

<style scoped lang="scss">
    @include formWrap(4);
    .contractType {
        .card-box {
            margin: 16px 24px;
            .handling-opinions {
                padding: 20px;
            }
            .handling-commit {
                min-height: 55px;
                .btn {
                    margin: 10px;
                    float: right;
                }
            }
            .int-text {
                color: #999;
            }
        }
    }
</style>
